<template>
  <div class="wholesale-detail">
    <div class="block">
      <header>
        <h2>{{infoId ? '编辑' : '新增'}}配置</h2>
      </header>
      <div class="box-content value-added-form">
        <el-form ref="ruleForm" :model="params" label-width="110px">
          <el-form-item label="原厂：">
            <el-select
              v-model="params.originalFactoryCode"
              filterable
              remote
              clearable
              :disabled="!!infoId"
              placeholder="请输入关键词"
              @change="queryProductLineList()"
              :remote-method="queryOriginalFactoryList"
              :loading="loading"
            >
              <el-option
                v-for="item in originalFactoryList"
                :key="item.originalFactoryCode"
                :label="item.originalFactoryName"
                :value="item.originalFactoryCode"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="产品线：">
            <el-select
              v-model="params.productLineCode"
              remote
              multiple
              clearable
              :disabled="!params.originalFactoryCode || !!infoId"
              placeholder="请选择产品线"
              :loading="loading">
              <el-option
                v-for="item in productLineList"
                :key="item.productLineCode"
                :label="item.productLineName"
                :value="item.productLineCode"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="订单类型：">
            <el-select v-model="params.orderTypeName" clearable placeholder="请选择">
              <el-option v-for="orderType in orderTypeList" :key="orderType.value + orderType.label"
                         :label="orderType.label" :value="orderType.label">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="附加值名称：">
            <el-input
              maxlength="50"
              show-word-limit
              v-model="params.attributeName"
              placeholder="请输入"/>
          </el-form-item>
          <el-form-item label="附加值类型：">
            <el-select v-model="params.attributeType"
                       clearable
                       @change="onTypeChange"
                       :disabled="!!infoId" placeholder="请选择">
              <el-option v-for="type in valueTypeList" :key="type.value"
                         :label="type.label" :value="type.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否必填：">
            <el-radio v-model="params.isMust" :label="1">是</el-radio>
            <el-radio v-model="params.isMust" :label="0">否</el-radio>
          </el-form-item>
          <el-form-item label="附加值默认值：">
            <el-input
              maxlength="50"
              show-word-limit
              :disabled="params.attributeType !== 3"
              v-model="defaultOption.label" placeholder="请输入"/>
          </el-form-item>
          <el-form-item v-for="(opt, i) in optionList" :key="i" label="附加值选项：">
            <el-input
              maxlength="50"
              show-word-limit
              :disabled="params.attributeType !== 3"
              v-model="opt.label" placeholder="请输入"/>
            <div class="option-handle" v-if="params.attributeType === 3">
              <i class="el-icon-plus"
                 zise="32"
                 v-if="i === optionList.length - 1" @click="addOption"/>
              <i class="el-icon-minus"
                 zise="32"
                 v-if="optionList.length > 1" @click="delOption(opt.label)"/>
            </div>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>
<script src="./index.js"></script>

<style lang="less" src="./index.less" scoped></style>
